import React from 'react';
import { Routes, Route, Navigate } from 'react-router-dom';
import { ConfigProvider } from 'antd';
import zhCN from 'antd/locale/zh_CN';
import './styles/index.css';

// 页面组件（暂时创建空组件，后续实现）
const LoginPage = () => <div>后台管理 - 管理员登录</div>;
const DashboardPage = () => <div>后台管理 - 仪表盘</div>;
const ProductManagePage = () => <div>后台管理 - 商品管理</div>;
const CategoryManagePage = () => <div>后台管理 - 分类管理</div>;
const OrderManagePage = () => <div>后台管理 - 订单管理</div>;
const UserManagePage = () => <div>后台管理 - 用户管理</div>;
const AdminManagePage = () => <div>后台管理 - 管理员管理</div>;
const RoleManagePage = () => <div>后台管理 - 角色管理</div>;

// 布局组件
const Layout: React.FC<{ children: React.ReactNode }> = ({ children }) => {
  return (
    <div className="admin-app">
      <div className="admin-content">
        {children}
      </div>
    </div>
  );
};

const App: React.FC = () => {
  return (
    <ConfigProvider locale={zhCN}>
      <Layout>
        <Routes>
          {/* 登录页面 */}
          <Route path="/login" element={<LoginPage />} />
          
          {/* 主要管理页面 */}
          <Route path="/dashboard" element={<DashboardPage />} />
          <Route path="/products" element={<ProductManagePage />} />
          <Route path="/categories" element={<CategoryManagePage />} />
          <Route path="/orders" element={<OrderManagePage />} />
          <Route path="/users" element={<UserManagePage />} />
          <Route path="/admins" element={<AdminManagePage />} />
          <Route path="/roles" element={<RoleManagePage />} />
          
          {/* 默认重定向 */}
          <Route path="/" element={<Navigate to="/dashboard" replace />} />
          <Route path="*" element={<Navigate to="/admin/dashboard" replace />} />
        </Routes>
      </Layout>
    </ConfigProvider>
  );
};

export default App; 